﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="/ViewV5/CSS/bootstrap3.3.5/css/bootstrap.min.css" rel="stylesheet" />
    <script src="/ViewV5/JS/jquery-1.11.2.min.js"></script>
    <script src="/ViewV5/JS/avalon1.47.js"></script>
    <link rel="stylesheet" href="/ViewV5/CSS/icfont_qj/iconfont.css">
    <link href="/ViewV5/CSS/bootstrap3.3.5/css/bootstrap.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="/ViewV5/CSS/animate.css">
    <link rel="stylesheet" type="text/css" href="/ViewV5/CSS/index.css">
    <link rel="stylesheet" type="text/css" href="/ViewV5/CSS/default.css">
    <style>
        .ms-controller, .ms-important, [ms-controller], [ms-important] {
            visibility: hidden;
        }

        .progress-of {
            height: 3px;
            background: #e1e6ea;
        }

            .progress-of .list {
                width: 33.333%;
                float: left;
                height: 100%;
                position: relative;
            }

                .progress-of .list span {
                    width: 15px;
                    height: 15px;
                    display: inline-block;
                    position: absolute;
                    left: 50%;
                    margin-left: -5px;
                    top: -5px;
                    background: #e1e6ea;
                    border-radius: 50%;
                }

                .progress-of .list i {
                    position: relative;
                    top: -30px;
                    display: inline-block;
                }

                .progress-of .list.active {
                    background: #2798df;
                }

                    .progress-of .list.active span {
                        background: #2798df;
                    }

        .progress-item {
            margin-bottom: 40px;
        }

        .progress-item-select {
            margin-left: 25px;
        }

            .progress-item-select select {
                width: 200px;
                height: 25px;
                margin-top: 5px;
            }

        .progress-btn {
            position: fixed;
            bottom: 0;
            right: 0;
            padding: 20px;
            border-top: 1px solid #E7E7E7;
            width: 100%;
            background: #F9F9F9;
        }
    </style>
    <script type="text/javascript">
        var model = avalon.define({
            $id: "APP_XTGL_IMPORTUSER",
            UserData: [],
            ImportCount: 0,
            InitPass: "",
            LoadUser: function () {
                if (document.getElementById("upFile").files.length > 0) {
                    $(".tp-man").show();
                    model.UserData.clear();
                    model.ImportCount = 0;
                    var formData = new FormData();
                    formData.append("upFile", document.getElementById("upFile").files[0]);
                    formData.append("headrow", 2);
                    $.ajax({
                        url: "/api/Auth/IMPORTUSER",
                        type: "POST",
                        data: formData,
                        /**
                        *必须false才会自动加上正确的Content-Type
                        */
                        contentType: false,
                        /**
                        * 必须false才会避开jQuery对 formdata 的默认处理
                        * XMLHttpRequest会对 formdata 进行正确的处理
                        */
                        processData: false,
                        success: function (result) {
                            $(".tp-man").hide();
                            document.getElementById("upFile").outerHTML = document.getElementById("upFile").outerHTML;
                            $("#upFile").change(function () {
                                model.LoadUser();
                            });
                            var r = $.parseJSON(result);
                            if (r.ErrorMsg == "") {
                                model.UserData = r.Result;
                                if (model.UserData.size() > 0) {
                                    model.ImportCount = model.UserData.size();
                                    $(".list").removeClass("active");
                                    $(".list").eq(1).addClass("active");
                                    $(".tab").hide();
                                    $(".tab").eq(1).show();
                                    $("#ksdr").show();
                                } else {
                                    top.com
                                }
                            }
                            else {
                                top.ComFunJS.winwarning(r.ErrorMsg);
                            }
                        }
                    });
                }
                else {
                    top.ComFunJS.winwarning("请上传文件");
                }
            }, isFS: false,
            ChangeIsFS: function () {
                model.isFS = !model.isFS;
            }, ImportMsg: "", ErrorMsg: "", SaveUser: function (dom) {
                if (model.InitPass == "") {
                    top.ComFunJS.winwarning("请输入初始密码");
                    return;
                }
                var strRegex = /^(?=.*[a-zA-Z]+)(?=.*[0-9]+)[a-zA-Z0-9]+$/;
                if (model.InitPass && (!strRegex.test(model.InitPass) || $.trim(model.InitPass).length < 6 || $.trim(model.InitPass).length > 16)) {
                    top.ComFunJS.winwarning("密码必须为6-16位长度,建议用英文和数字的组合");
                    return;
                }
                $(dom).text("正在导入，请稍后");
                $(dom).attr("disabled", true);
                $("#qxbtn").attr("disabled", true);
                $.getJSON("/api/Auth/ExeAction?Action=SAVEIMPORTUSER", {  P1: JSON.stringify(model.UserData.$model), P2: model.InitPass, issend: model.isFS },
                       function (result) {
                           model.UserData.clear();
                           $(".list").removeClass("active");
                           $(".list").eq(2).addClass("active");
                           $(".tab").hide();
                           $(".tab").eq(2).show();
                           $("#ksdr").hide();
                           model.ImportMsg = "共执行了" + model.ImportCount + "个用户<br/>" + result.Result1;
                           model.ErrorMsg= result.Result;
                           $(dom).text("确定导入");
                           $(dom).attr("disabled", false);
                           $("#qxbtn").attr("disabled", false);
                       })
            }, UploadClick: function () {
                $("#upFile").trigger("click");
            }, qx: function () {
                top.layer.closeAll();
            },
        })
    </script>
</head>
<body>
    <div class="container-fluid" ms-controller="APP_XTGL_IMPORTUSER">
        <div class="padding20" style="padding-bottom:90px;">
            <div class="progress-of tc" style="margin-top:40px;margin-bottom:30px;">
                <div class="list active">
                    <span></span>
                    <i>上传文档</i>
                </div>
                <div class="list">
                    <span></span>
                    <i>预览数据</i>
                </div>
                <div class="list">
                    <span></span>
                    <i>完成</i>
                </div>
            </div>
            <div class="tab">
                <div class="mb20 progress-item">
                    <p>一、请按照数据模板的格式，准备要导入的数据</p>
                    <p class="mb10">&nbsp;&nbsp;&nbsp;&nbsp;<a style="color:red;" ms-attr-href="'/ViewV5/AppPage/XTGL/import_user.xlsx'"> 下载数据模板 </a></p>

                </div>
                <div class="mb20 progress-item">
                    <p>二、请选择需要导入的文件</p>
                    <p style="margin-left:25px;" class="mt10">
                        <button type="button" class="btn btn-info btn-sm" ms-click="UploadClick()"><i class="iconfont icon-fj ft14 mr5"></i>添加附件</button>
                        <input type="file" name="upFile" id="upFile" class="form-control" ms-change="LoadUser()" accept=".xls,.xlsx" style="display:none;">
                    </p>
                </div>
                <div class="tp-progress mt20 mb20">
                    <div class="tp-man mt5 c999" style="width:60%;display:none;background:transparent;">
                        导入中....
                    </div>
                    <div>
                        <span style="color:red;">{{ImportMsg|html}}</span>
                    </div>
                </div>
            </div>
            <div class="tab" style="display:none;">
                <span style="color:red;">{{ImportMsg|html}}</span>
                <ul class="clearfix" style="display: block; padding: 0">
                    <li class="add-item add-width  fl-left">
                        <label class="add-item-label">初始密码</label>
                        <div class="add-ic">
                            <input type="text" class="form-control pull-left" ms-duplex="InitPass" style="width:300px;" />
                            <label style=" margin-top: 5px; margin-left: 10px; ">
                                <div class="icheckbox_square-blue mr5 " ms-class-1="checked:isFS" ms-click="ChangeIsFS()">
                                    <span class="iconfont icon-check ft12"></span>
                                </div>是否发送短信通知
                            </label>
                        </div>

                    </li>
                </ul>
                <div class="default-tab ft14 pt20 table-responsive" style="margin-top:1rem; max-height:300px">
                    <table class="table table-striped  table-hover">
                        <thead>
                            <tr>
                                <th>姓名</th>
                                <th>性别</th>
                                <th>手机号</th>
                                <th>邮箱</th>
                                <th>所在部门</th>
                                <th>职务</th>
                                <th>岗位</th>
                                <th>房间号</th>
                                <th>人员排序</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ms-repeat-item="UserData">
                                <td>{{item.姓名}}</td>
                                <td>{{item.性别}}</td>
                                <td>{{item.手机号}}</td>
                                <td>{{item.邮箱}}</td>
                                <td>{{item.所在部门}}</td>
                                <td>{{item.职务?item.职务:"员工"}}</td>
                                <td>{{item.岗位}}</td>
                                <td>{{item.房间号}}</td>
                                <td>{{item.人员排序}}</td>
                            </tr>
                        </tbody>
                    </table>

                </div>
            </div>
            <div class="tab" style="display:none;">
                <span></span>
                <br />
                <span style="color:green;">{{ImportMsg|html}}</span>
                <span style="color:red;">{{ErrorMsg|html}}</span>
            </div>
        </div>
        <div class="progress-btn tr">
            <span ms-visible="UserData.size()>0" class="pull-left">共{{UserData.size()}}条数据</span>
            <button type="button" class="btn btn-default" id="qxbtn" ms-click="qx()">取消</button>
            <button type="button" class="btn btn-info" ms-click="SaveUser(this)" id="ksdr" style="display:none;">开始导入</button>
        </div>

    </div>
</body>
</html>
